<template>
  <div id="app">
  <button @click="info">消息</button>
  <button @click="success">通知</button>
  <button @click="warning">成功</button>
  <button @click="error">错误</button>
  <button @click="a">a</button>
    <div v-loading="true"></div>
    <div v-tooltip.top="true">上</div>
  </div>
</template>
<script>

export default {
  data() {
    return {
    };
  },
  methods: {
    info() {
      this.$abc({
        duration: 1000,
        center: true,
        dangerouslyUserHTMLString: true,
        message: '<span>这是消息</span>',
        type: 'info',
      });
    },
    success() {
      this.$abc({
        duration: 1000,
        center: true,
        dangerouslyUserHTMLString: true,
        message: '<span>这是通知</span>',
        type: 'success',
      });
    },
    warning() {
      this.$abc({
        duration: 1000,
        center: true,
        dangerouslyUserHTMLString: true,
        message: '<span>这是成功</span>',
        type: 'warning',
      });
    },
    error() {
      this.$abc({
        duration: 1000,
        center: true,
        dangerouslyUserHTMLString: true,
        message: '<span>这是失败</span>',
        type: 'error',
      });
    },
    a() {
      this.$box({
        Bos: false,
        duration: 1000,
        type: 'error',
      });
    },
  },
};
</script>
<style scoped>
  #app{
    width: 100vw;
    height: 100vh;
  }
</style>
